

$(document).ready(function(){
    // render
    loadData();
    // event
    bindEvent();
});

function loadProductDetailCode(){
    var now = new Date();
    ProductDetail_code_auto = "CTSP" + now.getTime();
    ISS.DOM.setVal('#ProductDetail_code', ProductDetail_code_auto);
}

function loadData() {

    loadProductDetailCode();

    var maSP = ISS.SESSION.getSession('session_maSP');
    if(maSP == null){
        ISS.BACKEND.request({
            url: ISS.SESSION.getSession('contextPath') + '/service/admin/ad_GetAllProductDetail',
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json'
            },
            type: 'GET',
            dataType: 'json',
            success: function (data) {
                var responseContent = data.responseObject;
                mapAllProductDetailToView(responseContent);
            }
        });
    }
    else{
//        alert('qua trang detail' + maSP);
        ISS.BACKEND.request({
//            url: SERVER.contextPath + '/service/admin/getDataDetailOfDataCommon/' + maSP,
            url: ISS.SESSION.getSession('contextPath') + '/service/admin/getDataDetailOfDataCommon/' + maSP,
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json'
            },
            type: 'GET',
            dataType: 'json',
            success: function (data) {
                var responseContent = data.responseObject;
                mapAllProductDetailSearchToView(responseContent);
                mapDataProductComplete(responseContent);
//                ISS.CONTROL.unLockScreen();
            }
        });

    }

    ISS.BACKEND.request({
        url: ISS.SESSION.getSession('contextPath') + '/service/admin/ad_GetAllProductList',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json'
        },
        type: 'GET',
        dataType: 'json',
        success: function (data) {
            var responseContent = data.responseObject;
            mapAllProductListToView(responseContent);
        }
    });

    ISS.BACKEND.request({
        url: ISS.SESSION.getSession('contextPath') + '/service/admin/ad_GetAllColor',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json'
        },
        type: 'GET',
        dataType: 'json',
        success: function (data) {
            var responseContent = data.responseObject;
            mapAllColorToView(responseContent);
        }
    });

    ISS.BACKEND.request({
        url: ISS.SESSION.getSession('contextPath') + '/service/admin/ad_GetAllSize',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json'
        },
        type: 'GET',
        dataType: 'json',
        success: function (data) {
            var responseContent = data.responseObject;
            mapAllSizeToView(responseContent);
        }
    });

    ISS.BACKEND.request({
        url: ISS.SESSION.getSession('contextPath') + '/service/admin/ad_GetAllMotifInProductDetail',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json'
        },
        type: 'GET',
        dataType: 'json',
        success: function (data) {
            var responseContent = data.responseObject;
            mapAllMotifToView(responseContent);
        }
    });

    ISS.BACKEND.request({
        url: ISS.SESSION.getSession('contextPath') + '/service/admin/ad_GetAllProductInProductDetail',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json'
        },
        type: 'GET',
        dataType: 'json',
        success: function (data) {
            var responseContent = data.responseObject;
            mapAllProductToView(responseContent);
        }
    });
}

function bindEvent() {
    ISS.EVENT.bindEvent('#ProductDetail_Add1', 'click', function () {
        if(validate()){
            sendInfo();
        }
        else {
            var htmlText = '<div class="box s-error mbs msgBox l-pageWrapper mbm">\
                                <div class="pam">Thêm chi tiết sản phẩm thất bại</div>\
                            </div>';
            ISS.DOM.before('.l-register__benefits', htmlText);
        }
    });

    ISS.EVENT.bindEvent('#ProductDetail_Add', 'click', function () {
        toProductDetailPage();
    });

    ISS.EVENT.bindEvent('#buttonAddProductDetailPicture_Agree', 'click', function () {
        ISS.DOM.addClass('#boxTrackConfirmPicture', 'hideBox');
        ISS.DOM.addClass('#buttonProductDetail_Add', 'hideBox');
        ISS.DOM.removeClass('#boxDetailProductPicture', 'hideBox');
    });

    ISS.EVENT.bindEvent('#buttonAddProductDetailPicture_Cancel', 'click', function () {
        ISS.DOM.addClass('#boxTrackConfirmPicture', 'hideBox');
    });

    ISS.DOM.html('#upload_template', '<div id="multipleupload">Upload</div>');
    var maCTSP = ISS.DOM.getVal('#ProductDetail_code');
    var _upload = $("#multipleupload").uploadFile({
        url: ISS.SESSION.getSession('contextPath') + "/service/admin/insertProductPicture",
        autoSubmit:false,
        multiple:true,
        fileName:"myfile",
        formData: {"maCTSP": maCTSP}
    });

    ISS.EVENT.bindEvent('#startUpload', 'click', function () {
        _upload.startUpload();
    });

    ISS.EVENT.bindEvent('#ProductDetailPicture_Cancel1', 'click', function () {
        ISS.DOM.addClass('#boxDetailProductPicture', 'hideBox');
        ISS.DOM.removeClass('#buttonProductDetail_Add', 'hideBox');
    });

    ISS.EVENT.bindEvent('#ProductDetail_Retype1', 'click', function () {
        ISS.DOM.removeClass('#boxProductDetailPicture_Quit1', 'size1of3');
        ISS.DOM.removeClass('#boxProductDetail_Add1', 'size1of3');
        ISS.DOM.removeClass('#boxProductDetail_Retype1', 'size1of3');
        ISS.DOM.addClass('#boxProductDetail_Picture_Add1', 'hideBox');
        ISS.DOM.addClass('#boxProductDetailPicture_Quit1', 'size1of4');
        ISS.DOM.addClass('#boxProductDetail_Add1', 'size1of4');
        ISS.DOM.addClass('#boxProductDetail_Retype1', 'size1of4');
        ISS.DOM.addClass('#boxProductDetail_Picture_Add1', 'hideBox');

        loadProductDetailCode();
        ISS.DOM.setVal('#ProductDetail_unitPrice', "");
        ISS.DOM.setVal('#ProductDetail_quantity', "");
        ISS.DOM.setVal('#ProductDetail_size', "default_value");
        ISS.DOM.setVal('#ProductDetail_color', "default_value");
        ISS.DOM.setVal('#ProductDetail_motif', "default_value");
    });

    ISS.EVENT.bindEvent('#ProductDetail_Quit1', 'click', function () {
        ISS.DOM.removeClass('#boxTrackConfirmQuit', 'hideBox');
    });

    ISS.EVENT.bindEvent('#buttonQuitSession_Agree', 'click', function () {
        quitSession();
    });

    ISS.EVENT.bindEvent('#buttonQuitSession_Cancel', 'click', function () {
        ISS.DOM.addClass('#boxTrackConfirmQuit', 'hideBox');
    });

    ISS.EVENT.bindEvent('#ProductDetail_Add', 'click', function () {
        toProductDetailPage();
    });

/*    ISS.EVENT.bindEvent('#ProductDetail_Exit', 'click', function () {
        toProductCommonPage();
    });*/

    ISS.EVENT.bindEvent('#ProductDetail_Modified', 'click', function () {
        toEditPage();
    });

    ISS.EVENT.bindEvent('#ProductDetail_Delete', 'click', function () {
        ISS.DOM.removeClass('#boxTrackDeleteConfirm', 'hideBox');
    });

    ISS.EVENT.bindEvent('#buttonDeleteProductDetail_Agree', 'click', function () {
        var _listCTSP = [];
        var _maCTSP = [];

        ISS.DOM.forEach('input[type="checkbox"]:checked', function(){
            _maCTSP.push(ISS.DOM.getVal(this));
        });

        if(_maCTSP.length > 0) {
            for(var i = 0; i < _maCTSP.length; i++) {
                var _picture = {};
                _picture.maCTSP = _maCTSP[i];
                _listCTSP.push(_picture);
            }
//            _listBillDelete = _listHoaDon;

//            ISS.CONTROL.lockScreen('#content');
            ISS.BACKEND.request({
                url: SERVER.contextPath + '/service/admin/deleteProductDetail/',
                headers: {
                    'Accept': 'application/json',
                    'Content-Type': 'application/json'
                },
                type: 'POST',
                dataType: 'json',
                data: JSON.stringify(_listCTSP),
                success: function (data) {
                    if(data.code == 0) {
                        toDetailPage();
//                        ISS.DOM.removeClass('#boxTrackDeleteSuccess', 'hideBox');
//                        ISS.CONTROL.unLockScreen();
                    }
                }
            });
        }
        else {
            alert('Bạn chưa chọn chi tiết sản phẩm nào');
        }
    });

    ISS.EVENT.bindEvent('#buttonDeleteProductDetail_Cancel', 'click', function () {
        ISS.DOM.addClass('#boxTrackDeleteConfirm', 'hideBox');
        toDetailPage();
    });

    ISS.EVENT.bindEvent('#buttonDeleteSuccessProductDetail_Hide', 'click', function () {
        ISS.DOM.addClass('#boxTrackDeleteSuccess', 'hideBox');
    });
}

function toEditPage() {
    var maCTSP = [];
    ISS.DOM.forEach('#form-product-detail input[type="checkbox"]:checked', function(){
        maCTSP.push($(this).val());
    });

    if(maCTSP.length == 1) {
        var url = '/service/admin/toEditProductDetailPage/' + maCTSP[0];
        ISS.WINDOW.location(url);
    }
    else {
        alert('Không được chọn hơn một dòng');
    }
}

function quitSession(){
    toDetailPage();
}

function sendInfo() {
    var productDetail = {};
    var product = {}, size = {}, color = {}, motif ={};

    productDetail.maCTSP = ISS.DOM.getVal('#ProductDetail_code');
    productDetail.giaSP = ISS.DOM.getVal('#ProductDetail_unitPrice');
    productDetail.soLuong = ISS.DOM.getVal('#ProductDetail_quantity');

    product.maSP = ISS.DOM.getVal('#ProductCommon_code');
    productDetail.sanPham = product;

    size.maSize = ISS.DOM.getVal('#ProductDetail_size');
    productDetail.kichThuoc = size;

    color.maMau = ISS.DOM.getVal('#ProductDetail_color');
    productDetail.mauSac = color;

    motif.maHoaTiet = ISS.DOM.getVal('#ProductDetail_motif');
    productDetail.hoaTiet = motif;

    ISS.BACKEND.request({
        url: ISS.SESSION.getSession('contextPath') + '/service/admin/ad_AddProductDetail',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json'
        },
        type: 'POST',
        dataType: 'json',
        data: JSON.stringify(productDetail),
        success: function (data) {
            var code = data.code;
            loadDataComplete(code);
        }
    });
}

function loadDataComplete(code){
    if (code == 0){
        ISS.DOM.removeClass('#boxTrackConfirmPicture', 'hideBox');
        ISS.DOM.removeClass('#boxProductDetailPicture_Quit1', 'size1of3');
        ISS.DOM.removeClass('#boxProductDetail_Add1', 'size1of3');
        ISS.DOM.removeClass('#boxProductDetail_Retype1', 'size1of3');
        ISS.DOM.removeClass('#boxProductDetail_Picture_Add1', 'hideBox');
        ISS.DOM.addClass('#boxProductDetailPicture_Quit1', 'size1of4');
        ISS.DOM.addClass('#boxProductDetail_Add1', 'size1of4');
        ISS.DOM.addClass('#boxProductDetail_Retype1', 'size1of4');

    }
    else{
        alert('Thêm chi tiết sản phẩm mới thất bại');
    }
}

function clearValidate() {
    ISS.DOM.removeClass('#AdPost_Code', 'error');
    ISS.DOM.removeClass('#AdPost_Title', 'error');
}

function validate() {
    var result = true;
    return result;
}

function toProductDetailPage(){
    var maSP = ISS.SESSION.getSession('session_maSP');
    var _url = '/service/admin/toProductInformationPage/' + maSP;
    ISS.WINDOW.location(_url);
/*    var _url = '/ad-product-detail-add.jsp';
     ISS.WINDOW.location(_url);*/
}

function toProductCommonPage(){
    /*var maSP = ISS.SESSION.getSession('session_maSP');
    var _url = '/service/admin/toProductInformationPage/' + maSP;
    ISS.WINDOW.location(_url);*/
    /*var _url = ISS.SESSION.getSession('contextPath') + '/ad-product-common.jsp';
     ISS.WINDOW.location(_url);*/
    var _url = '/service/admin/toProductCommonPage';
    ISS.WINDOW.location(_url);

}

function toDetailPage() {
    var maSP = ISS.SESSION.getSession('session_maSP');
    var _url = '/service/admin/toProductDetailPage/' + maSP;
    ISS.WINDOW.location(_url);
}

function mapAllProductDetailToView(product) {
    var rows = product.length;
    var columns = 1;
    var str = '';
    str += '<table id="ProductDetailTable" class="tableProductDetailWidth align-center">';
    str += '<thead>';
    str += '   <tr>';
    str += '       <th class="columnProductDetailSTT">STT</th>';
    str += '       <th class="columnProductDetailStick">Tick</th>';
    str += '       <th class="columnProductDetail_ProductCode">Mã SP</th>';
    str += '       <th class="columnProductDetailCode">Mã CTSP</th>';
    str += '       <th class="columnProductDetail_Category">Danh mục</th>';
    str += '       <th class="columnProductDetailTitle">Tên</th>';
    str += '       <th class="columnProductDetailColor">Màu</th>';
    str += '       <th class="columnProductDetailSize">Size</th>';
    str += '       <th class="columnProductDetailSexual">ĐT</th>';
    str += '       <th class="columnProductDetailPicture">Hình ảnh</th>';
    str += '       <th class="columnProductDetailPatern">Hoạ tiết</th>';
    str += '       <th class="columnProductDetailQuantity">SL</th>';
    str += '       <th class="columnProductDetailPrice">Đơn giá (VND)</th>';
    str += '   </tr>';
    str += '</thead>';
    str += '<tbody>';
    for(var i = 0; i < rows; i++){
        if (i%2==0){
            str += '<tr onmouseover="set_hover(this);" onmouseout="remove_hover(this)" id="showData" class="column-Light tableTransparent">';
        }else{
            str += '<tr onmouseover="set_hover(this);" onmouseout="remove_hover(this)" id="showData" class="column-Light tableTransparent">';
        }
        for (var j = 0; j < columns; j++){
            str += '<td class="columnProductDetailSTT tableProductDetailPadding">' + (i+1) + '</td>';
            str += '<td class="columnProductDetailStick tableProductDetailPadding"><input onclick="highlight_row(this)" id="' + product[i].maCTSP + '" type="checkbox" value="' + product[i].maCTSP + '"/></td>';
            str += '<td class="columnProductDetail_ProductCode tableProductDetailPadding" id="' + product[i].sanPham.maSP + '">' + product[i].sanPham.maSP + '</td>';
            str += '<td class="columnProductDetailCode tableProductDetailPadding" id="' + product[i].maCTSP + '">' + product[i].maCTSP + '</td>';
            str += '<td class="columnProductDetail_Category tableProductDetailPadding" id="' + product[i].sanPham.loaiDanhMucSanPham.maLoaiDMSP + '">' + product[i].sanPham.loaiDanhMucSanPham.tenLoaiDMSP + '</td>';
            str += '<td class="columnProductDetailTitle tableProductDetailPadding" title="' + product[i].sanPham.tenSP + '">' + product[i].sanPham.tenSP.trunc(100,true) + '</td>';
            str += '<td class="columnProductDetailColor tableProductDetailPadding" id="' + product[i].mauSac.maMau + '">' + product[i].mauSac.tenMau + '</td>';
            str += '<td class="columnProductDetailSize tableProductDetailPadding" id="' + product[i].kichThuoc.maSize + '">' + product[i].kichThuoc.tenSize + '</td>';
            str += '<td class="columnProductDetailSexual tableProductDetailPadding">' + product[i].sanPham.doiTuong + '</td>';
            str += '<td class="columnProductDetailPicture tableProductDetailPadding">Picture ' +  i + '.jpg</td>';
            str += '<td class="columnProductDetailPatern tableProductDetailPadding" id="' + product[i].hoaTiet.maHoaTiet + '">' +  product[i].hoaTiet.tenHoaTiet + '</td>';
            str += '<td class="columnProductDetailQuantity tableProductDetailPadding">' +   product[i].soLuong + '</td>';
            str += '<td class="columnProductDetailPrice tableProductDetailPadding">'+ formatCurency(product[i].giaSP) +'</td>';
        }
        str += '</tr>';
    }
    str +=   '</tbody>';
    str += '</table>';

    ISS.DOM.html('#ProductDetail_All', str);

}

function mapAllProductDetailSearchToView(product) {
    var rows = product.chiTietSanPhams.length;
    var columns = 1;
    var str = '';
    str += '<table id="ProductDetailTable" class="tableProductDetailWidth align-center">';
    str += '<thead>';
    str += '   <tr>';
    str += '       <th class="columnProductDetailSTT">STT</th>';
    str += '       <th class="columnProductDetailStick">Tick</th>';
    str += '       <th class="columnProductDetail_ProductCode">Mã SP</th>';
    str += '       <th class="columnProductDetailCode">Mã CTSP</th>';
    str += '       <th class="columnProductDetail_Category">Danh mục</th>';
    str += '       <th class="columnProductDetailTitle">Tên</th>';
    str += '       <th class="columnProductDetailColor">Màu</th>';
    str += '       <th class="columnProductDetailSize">Size</th>';
    str += '       <th class="columnProductDetailSexual">ĐT</th>';
    str += '       <th class="columnProductDetailPicture">Hình ảnh</th>';
    str += '       <th class="columnProductDetailPatern">Hoạ tiết</th>';
    str += '       <th class="columnProductDetailQuantity">SL</th>';
    str += '       <th class="columnProductDetailPrice">Đơn giá (VND)</th>';
    str += '   </tr>';
    str += '</thead>';
    str += '<tbody>';
    if(product.chiTietSanPhams) {
        for(var i = 0; i < rows; i++){
            if (i%2==0){
                str += '<tr onmouseover="set_hover(this);" onmouseout="remove_hover(this)" id="showData" class="column-Light tableTransparent">';
            }else{
                str += '<tr onmouseover="set_hover(this);" onmouseout="remove_hover(this)" id="showData" class="column-Light tableTransparent">';
            }

            for(var j = 0; j<columns; j++) {
                var _images = product.chiTietSanPhams[i].hinhAnhSanPham;
                var _color = product.chiTietSanPhams[i].mauSac;
                var _size = product.chiTietSanPhams[i].kichThuoc;
                var _motif = product.chiTietSanPhams[i].hoaTiet;
                var _catelogy = product.loaiDanhMucSanPham;
                var _sexual = product.doiTuong;
                var _productname = product.tenSP;
                var _quality = product.chiTietSanPhams[i].soLuong;
                var _price = product.chiTietSanPhams[i].giaSP;

                str += '<td class="columnProductDetailSTT tableProductDetailPadding">' + (i+1) + '</td>';
                str += '<td class="columnProductDetailStick tableProductDetailPadding"><input onclick="highlight_row(this)" id="' + product.chiTietSanPhams[i].maCTSP + '" type="checkbox" value="' + product.chiTietSanPhams[i].maCTSP + '"/></td>';
                str += '<td class="columnProductDetail_ProductCode tableProductDetailPadding word_break" title="' + product.maSP + '">' + product.maSP + '</td>';
                str += '<td class="columnProductDetailCode tableProductDetailPadding word_break" title="' + product.chiTietSanPhams[i].maCTSP + '">' + product.chiTietSanPhams[i].maCTSP + '</td>';
                if(_catelogy) {
                    str += '<td class="columnProductDetail_Category tableProductDetailPadding" id="' + product.loaiDanhMucSanPham.maLoaiDMSP + '">' + product.loaiDanhMucSanPham.tenLoaiDMSP + '</td>';
                } else {
                    str += '<td class="columnProductDetail_Category tableProductDetailPadding">Trống</td>';
                }
                if(_productname) {
                    str += '<td class="columnProductDetailTitle tableProductDetailPadding" title="' + product.tenSP + '">' + product.tenSP.trunc(100,true) + '</td>';
                } else {
                    str += '<td class="columnProductDetailTitle tableProductDetailPadding">Trống</td>';
                }

                if(_color) {
                    str += '<td class="columnProductDetailColor tableProductDetailPadding" id="' + product.chiTietSanPhams[i].mauSac.maMau + '">' + product.chiTietSanPhams[i].mauSac.tenMau + '</td>';
                } else {
                    str += '<td class="columnProductDetailColor tableProductDetailPadding">Trống</td>';
                }

                if(_size) {
                    str += '<td class="columnProductDetailSize tableProductDetailPadding" id="' + product.chiTietSanPhams[i].kichThuoc.maSize + '">' + product.chiTietSanPhams[i].kichThuoc.tenSize + '</td>';
                } else {
                    str += '<td class="columnProductDetailSize tableProductDetailPadding">Trống</td>';
                }

                if(_sexual) {
                    str += '<td class="columnProductDetailSexual tableProductDetailPadding">' + product.doiTuong + '</td>';
                } else {
                    str += '<td class="columnProductDetailSexual tableProductDetailPadding">Trống</td>';
                }

                if(_images[0]) {
                    str += '<td class="columnProductDetailPicture tableProductDetailPadding"><img src="'+ ISS.SESSION.getSession('contextPath') + _images[0].tenHinh + '" width="100px"></td>';
                } else {
                    str += '<td class="columnProductDetailPicture tableProductDetailPadding">Trống</td>';
                }

                if(_motif) {
                    str += '<td class="columnProductDetailPatern tableProductDetailPadding" id="' + product.chiTietSanPhams[i].hoaTiet.maHoaTiet + '">' +  product.chiTietSanPhams[i].hoaTiet.tenHoaTiet + '</td>';
                } else {
                    str += '<td class="columnProductDetailPatern tableProductDetailPadding">Trống</td>';
                }

                if(_quality) {
                    str += '<td class="columnProductDetailQuantity tableProductDetailPadding">' +   product.chiTietSanPhams[i].soLuong + '</td>';
                } else {
                    str += '<td class="columnProductDetailQuantity tableProductDetailPadding">Trống</td>';
                }

                if(_price) {
                    str += '<td class="columnProductDetailPrice tableProductDetailPadding">'+ formatCurency(product.chiTietSanPhams[i].giaSP) +'</td>';
                } else {
                    str += '<td class="columnProductDetailPrice tableProductDetailPadding">Trống</td>';
                }
            }

            str += '</tr>';
        }
    }
    str +=   '</tbody>';
    str += '</table>';

    ISS.DOM.html('#ProductDetail_All', str);

}

function mapDataProductComplete(product){
    ISS.DOM.setVal('#ProductCommon_code', product.maSP);
    ISS.DOM.setVal('#ProductCommon_name', product.tenSP);
    ISS.DOM.setVal('#ProductCommon_listProduct', product.loaiDanhMucSanPham.tenLoaiDMSP);
    ISS.DOM.setVal('#ProductCommon_information', product.thongTin);
    ISS.DOM.setVal('#ProductCommon_sexual', product.doiTuong);

}

function mapAllProductListToView(listproduct) {
    var html = '<option selected="selected" value="default_value">Mời chọn</option>';
    for(var i=0; i<listproduct.length; i++) {
        html += '<option value="' + listproduct[i].maLoaiDMSP + '">' + listproduct[i].tenLoaiDMSP + '</option>';
    }
    ISS.DOM.html('#ProductDetail_OptionListProduct', html);
}

function mapAllColorToView(color) {
    var html = '<option selected="selected" value="default_value">Mời chọn</option>';
    for(var i=0; i<color.length; i++) {
        html += '<option value="' + color[i].maMau + '">' + color[i].tenMau + '</option>';
    }
    ISS.DOM.html('#ProductDetail_OptionListColor', html);
    ISS.DOM.html('#ProductDetail_color', html);
}

function mapAllSizeToView(size) {
    var html = '<option selected="selected" value="default_value">Mời chọn</option>';
    for(var i=0; i<size.length; i++) {
        html += '<option value="' + size[i].maSize + '">' + size[i].tenSize + ' - ' + size[i].loaiDanhMuc.tenLoai + '</option>';
    }
    ISS.DOM.html('#ProductDetail_OptionListSize', html);
    ISS.DOM.html('#ProductDetail_size', html);
}

function mapAllMotifToView(motif) {
    var html = '<option selected="selected" value="default_value">Mời chọn</option>';
    for(var i=0; i<motif.length; i++) {
        html += '<option value="' + motif[i].maHoaTiet + '">' + motif[i].tenHoaTiet + '</option>';
    }
    ISS.DOM.html('#ProductDetail_motif', html);
}

function mapAllProductToView(product) {
    var html = '<option selected="selected" value="default_value">Mời chọn</option>';
    for(var i=0; i<product.length; i++) {
        html += '<option value="' + product[i].maSP + '">' + product[i].tenSP + '</option>';
    }
    ISS.DOM.html('#ProductDetail_product', html);
}